<script setup>
import { ref, computed } from 'vue'
import store from '@/store/index.js'
import { validateRequiredFields } from '@/utils/index.js'
import { onLoad } from '@dcloudio/uni-app'
import SubmitBtn from '@/components/SubmitBtn.vue'

const formData = ref({
	platenumber: "",
	tel: "",
	loadcapacity: "",
	brand: "",
	color: "",
})

onLoad(options => {
	if (!options.data) return
	const data = JSON.parse(options.data)
	formData.value = { ...data }
})

const confing = {
	api: '/logistics/car',
	isCustid:true,
	requiredFields: [{
		key: 'platenumber',
		name: '车牌号'
	}, {
		key: 'tel',
		name: '联系电话'
	}, {
		key: 'loadcapacity',
		name: '载重能力'
	}, {
		key: 'brand',
		name: '品牌'
	}, {
		key: 'color',
		name: '车辆颜色'
	}]
}
</script>

<template>
	<view class="carinfo page_container">
		<view class="content">
			<u-form :model="formData" label-width="150">
				<u-form-item label="车牌号" required>
					<u-input v-model="formData.platenumber" placeholder="请输入车牌号" />
				</u-form-item>
				<u-form-item label="联系电话" required>
					<u-input v-model="formData.tel" type="number" placeholder="请输入联系电话" />
				</u-form-item>
				<u-form-item label="载重能力" required>
					<u-input v-model="formData.loadcapacity" placeholder="请输入车辆载重能力" />
				</u-form-item>
				<u-form-item label="品牌" required>
					<u-input v-model="formData.brand" placeholder="请输入车辆品牌" />
				</u-form-item>
				<u-form-item label="车辆颜色" required>
					<u-input v-model="formData.color" placeholder="请输入车辆颜色" />
				</u-form-item>
			</u-form>
		</view>
		<SubmitBtn v-bind="confing" :formData="formData" />
	</view>
</template>

<style lang="scss" scoped>
.carinfo {
	min-height: 100vh;
	background: #f5f5f5;
	padding-top: 20rpx;

	.content {
		background: #fff !important;
		border-radius: 20rpx;
		padding: 0 40rpx;
		margin-bottom: 100rpx;
	}
}
</style>